<!DOCTYPE html>
<html>
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="../back-common.jsp"%>
<%@ include file="/WEB-INF/pages/common/taglib.jsp"%>
<%@ include file="/WEB-INF/pages/common/layui.jsp"%>
<head>
  <meta charset="utf-8">
  <title>目标列表</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link href="<ls:templateResource item='/resources/plugins/select2-4.0/select2.css'/>" rel="stylesheet"/>
</head>
<body> 
   <table class="${tableclass}" style="width: 100%">
	   <tr><th>
	          <strong class="am-text-primary am-text-lg">项目管理</strong> /  目标列表 - ${project.name}
	    	</th>
	    </tr>
	</table>   
		    
  <div style="margin-left: 0.5rem">
    <div class="seller_list_title">
        <ul class="seller_title_ul am-tabs-nav am-nav am-nav-tabs">
            <li><i></i><a href="<ls:url address="/admin/project/load/${project.id}"/>">项目信息</a></li>
            <li><i></i><a href="<ls:url address="/admin/projectPlan/query/${project.id}"/>">里程碑</a></li>
            <li class="am-active"><i></i><a href="<ls:url address="/admin/task/query/${project.id}"/>">目标</a></li>
            <li><i></i><a href="<ls:url address="/admin/projectModule/query/${project.id}"/>">模块</a></li>
            <li><i></i><a href="<ls:url address="/admin/projectMember/query/${project.id}"/>">团队</a></li>
            <li><i></i><a href="<ls:url address="/admin/projectReport/query/${project.id}"/>">报表</a></li>
        </ul>
    </div>
  </div>  

    <form id="form1"  onsubmit="return false">
        <table class="${tableclass}" style="min-width: 1000px;margin-bottom: 0;">
		    <tbody><tr><td>
		    	    <div align="left" style="padding: 3px;float: left;display:inline-block;width: 100%; overflow: auto;">
				       	    
				      <select class="combox ${selectclass}" style="height: 28px" id="moduleId" name="moduleId" requiredTitle="--选择模块--" showNone="false" retUrl="${contextPath}/admin/project/common/loadModules/${projectId}">
				      </select>
						<select class="combox ${selectclass}" style="height: 28px" id="planId" name="planId" requiredTitle="--选择里程碑--" showNone="false" retUrl="${contextPath}/admin/project/common/loadPlans/${projectId}">
						</select>
				     &nbsp; <input type="text" id="id" name="id" maxlength="50" value="${taskQueryDto.id}" size="5" style="height: 28px" placeholder="目标ID"/>
				     &nbsp; <input type="text" id="name" name="name" maxlength="50" value="${taskQueryDto.name}" style="height: 28px" placeholder="目标名称"/>
				     
				    <select name="assignedto" id="assignedto" style="width: 120px">
				    	<option value="">选择指派给</option>
					   	<c:if test="${not empty taskQueryDto.assignedto}">
					   	  <option value="${taskQueryDto.assignedto}" selected="selected">${taskQueryDto.assignedtoRealName}</option>
					   	</c:if>
				   </select>
				   
				   <select name="createBy" id="createBy" style="width: 120px">
				    <option value="">选择由谁建立</option>
				   	<c:if test="${not empty taskQueryDto.createBy}">
				   	  <option value="${taskQueryDto.createBy}" selected="selected">${taskQueryDto.createByRealName}</option>
				   	</c:if>
				   </select>	
				   
				    <select name="finishedby" id="finishedby" style="width: 120px">
				     <option value="">选择由谁完成</option>
				   	<c:if test="${not empty taskQueryDto.finishedby}">
				   	  <option value="${taskQueryDto.finishedby}" selected="selected">${taskQueryDto.finishedbyRealName}</option>
				   	</c:if>
				   </select>
				
				    <select name="canceledby" id="canceledby" style="width: 120px">
				    <option value="">选择由谁取消</option>
				   	<c:if test="${not empty taskQueryDto.canceledby}">
				   	  <option value="${taskQueryDto.canceledby}" selected="selected">${taskQueryDto.canceledbyRealName}</option>
				   	</c:if>
				   </select>   
				   
				    <select name="closedby" id="closedby" style="width: 120px">
				    <option value="">选择由谁关闭</option>
				   	<c:if test="${not empty taskQueryDto.closedby}">
				   	  <option value="${taskQueryDto.closedby}" selected="selected">${taskQueryDto.closedbyRealName}</option>
				   	</c:if>
				   </select> 
				   </div>
				   <!-- 第二行 -->
				   <div align="left" style="padding: 3px;float: left;display: inline;">
				   	 <select id="status" name="status" style="height: 28px">
					       <ls:optionGroup type="select" required="false" defaultDisp="--选择状态--" cache="true" beanName="TASK_STATUS" selectedValue="${item.status}" />
					  </select>
				   
				   	 <select id="type" name="type" style="height: 28px">
					    <ls:optionGroup type="select" required="false" cache="true" defaultDisp="--目标类型--"  beanName="TASK_TYPE" selectedValue="${task.type}"/>
		             </select> 
		             
					 <select id="priority" name="priority" style="height: 28px">
						<ls:optionGroup type="select" required="false" defaultDisp="--优先级--" cache="true" beanName="PRIORITY_LEVEL" selectedValue="${task.priority}"/>
		             </select> 
					   
					  <select id="searchTimeMode" name="searchTimeMode" style="height: 28px">
					      <ls:optionGroup type="select" required="true" defaultDisp="--时间模式--" cache="true" beanName="TASK_TIME_MODE" selectedValue="${item.searchTimeMode}" />
					  </select>  
					     从: 
						<input readonly="readonly"  name="startDate" id="startDate" class="Wdate" type="text" onClick="WdatePicker({dateFmt:'yyyy-MM-dd',onpicked:function(){endDate.focus();},maxDate:'#F{$dp.$D(\'endDate\')}'})" value='<fmt:formatDate value="${taskQueryDto.startDate}" pattern="yyyy-MM-dd"/>' />
						
						到: 
						<input readonly="readonly" name="endDate" id="endDate" class="Wdate" type="text" onClick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startDate\')}'})" value='<fmt:formatDate value="${taskQueryDto.endDate}" pattern="yyyy-MM-dd"/>' />
					    
					    <input type="submit" value="搜索" autocomplete="off" data-type="reload" class="from1_search criteria-btn"/>
					    <input type="button" value="创建" class="criteria-btn" onclick='window.location="<ls:url address='/admin/task/loadByProject/${project.id}'/>"'/>
					    <input type="button" value="看板" onclick="window.location='<ls:url address="/admin/task/dashboard/${project.id}"/>'" class="criteria-btn"/>
				    
				    </div>
				  
				</div>
		     </td></tr></tbody>
	    </table>
    </form>
    
       <div style="margin: 0.5rem;">
          <table id="taskList" lay-filter="task-filter" class="layui-hide"></table>
		</div>	
	
		 <div id="reportDta"  style="margin: 15px;" align="left">
		  <div id="totalConsumedDiv" style="display: none">
			  消耗的总工时&nbsp; <b id="totalConsumed"></b>&nbsp;小时，
			  消耗的总人天是&nbsp; <b id="totalManDay"></b>&nbsp;， 
			  消耗的总人月是&nbsp;<b id="totalManMonth"></b>&nbsp;<br/>
		  </div>
		  <div id="leftHoursDiv" style="display: none">
			  预计总剩余时间&nbsp;<b id="leftHours"> </b>&nbsp;小时
			  预计总剩余人天是&nbsp; <b id="leftDays"></b>&nbsp;， 
			  预计总剩余人月是&nbsp;<b id="leftMonth"></b>&nbsp;
		  </div>
		 </div>	
			
<!-- 优先级-->
<script type="text/html" id="priority_tmpl">
    {{#  if(d.priority == 1){ }}
		<font color="#d71319">紧急</font>
    {{#  } else if(d.priority == 2){ }}
		<font color="#ea644a">重要</font>
    {{#  } else if(d.priority == 3){}}
		<font color="#bd7b46">一般</font>
    {{#  } else if(d.priority == 4){}}
		<font color="#dcbe1a">次要</font>
    {{#  } }}
</script>

<!-- 状态
	UNSTART(0),//未开始
	PROCESSING(1),//进行中
	HANGUP(2),	//挂起
	DELAY(3), //延期
	FINISH(4),//已完成
	CLOSE(5),//已关闭
	CANCEL(6);//已取消
-->
<script type="text/html" id="status_tmpl">
    {{#  if(d.status == 0){ }}
		<font color="#ccc">未开始</font>
    {{#  } else if(d.status == 1){ }}
		<font color="#FFA500">进行中</font>
    {{#  } else if(d.status == 2){}}
		<font color="#FF3030">挂起</font>
    {{#  } else if(d.status == 3){}}
		<font color="#A0522D">延期</font>
    {{#  } else if(d.status == 4){}}
		<font color="#458B00">  已完成</font>
    {{#  } else if(d.status == 5){}}
		<font color="#FF3030">  已关闭</font>
    {{#  } else if(d.status == 6){}}
		<font color="#FF3030">  已取消</font>
    {{#  } }}
</script>

<!-- 开始时间-->
<script type="text/html" id="create_tmpl">
   {{layui.util.toDateString(d.createTime, 'yyyy-MM-dd')}} 
</script>

<!-- 截止时间-->
<script type="text/html" id="dead_tmpl">
   {{layui.util.toDateString(d.deadline, 'yyyy-MM-dd')}} 
</script>

<!-- 操作-->
<script type="text/html" id="taskListBar">
<div class="layui-btn-group" style="height: 30px;">
  <button class="layui-btn layui-btn-primary layui-btn-sm"  onclick="javascript:taskEstimate('{{d.id}}')">
    <i class="layui-icon" title="工时">&#xe631;</i>
  </button>
<div class="layui-btn-dropdown">
  <button type="button" class="layui-btn layui-btn-primary layui-btn-sm" data-toggle="dropdown"> <span class="layui-icon" style="font-size: 13px;"></span></button>
  <ul class="layui-dropdown-menu" style="font-size: 13px">
	  <li><a href="javascript:assignTask('{{d.id}}')">指派</a></li>
	  <li><a href="javascript:startTask('{{d.id}}')">开始</a></li>
	  <li><a href="javascript:finishTask('{{d.id}}')">完成</a></li>
	  <li class="divider"></li><!--分割线-->
	  <li><a href="javascript:cancelTask('{{d.id}}')">取消</a></li>
      <li><a href="javascript:closeTask('{{d.id}}')">关闭</a></li>
     <li><a href="${contextPath}/admin/task/load/{{d.id}}">详情</a></li>
  </ul>
</div>
  <button class="layui-btn layui-btn-primary layui-btn-sm" onclick="javascript:deleteById('{{d.id}}')">
    <i class="layui-icon" title="删除">&#xe640;</i>
  </button>
</div>
</script>

<script type='text/javascript' src="<ls:templateResource item='/resources/common/js/jquery.validate.js'/>" /></script>
<script type='text/javascript' src="<ls:templateResource item='/resources/common/js/jquery.serialize-object.min.js'/>" /></script>
<script src="<ls:templateResource item='/resources/plugins/select2-4.0/select2.full.min.js'/>" type="text/javascript"></script>
<script src="<ls:templateResource item='/resources/plugins/select2-4.0/i18n/zh-CN.js'/>" type="text/javascript"></script>
<script src="<ls:templateResource item='/resources/plugins/select2-4.0/makeSelect2.js'/>" type="text/javascript"></script>
<script src="<ls:templateResource item='/resources/plugins/My97DatePicker/WdatePicker.js'/>" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript">
     
  $(document).ready(function() {
     //三级联动
   	 $("select.combox").initSelect();
   	 makeSelect2(contextPath + "/admin/adminUser/userListInTeam/${project.id}","#assignedto","指派给","value","key");
   	 makeSelect2(contextPath + "/admin/adminUser/userListInTeam/${project.id}","#createBy","由谁建立","value","key");
   	 makeSelect2(contextPath + "/admin/adminUser/userListInTeam/${project.id}","#finishedby","由谁完成","value","key");  
   	 makeSelect2(contextPath + "/admin/adminUser/userListInTeam/${project.id}","#canceledby","由谁取消","value","key"); 
   	 makeSelect2(contextPath + "/admin/adminUser/userListInTeam/${project.id}","#closedby","由谁关闭","value","key"); 
   });
        
  //初始化表单
  layui.use('table', function(){
	 var table = layui.table;
 	 table.render({
 		skin: 'nob',
 		even: true,
	    elem: '#taskList'
	    ,url:'${contextPath}/admin/task/queryContentData/${project.id}'
	    ,cellMinWidth: 80 
	    ,page: true
	    ,limit:20
	    ,id: 'taskList_table'
    	 ,request: {
	            pageName: 'curPageNO' //页码的参数名称，默认：page
	            ,limitName: 'pageSize' //每页数据量的参数名，默认：limit
		 },response: { //定义后端 json 格式，详细参见官方文档
	            statusName: 'status', //状态字段名称
	            statusCode: '200', //状态字段成功值
	            msgName: 'msg', //消息字段
	            countName: 'total', //总数字段
	            dataName: 'resultList' //数据字段
	      },cols: [[
           {field:'id',  title: 'ID',width:70,sort: true}
	      ,{field:'priority',  title: 'P',width:60,sort: true,templet: '#priority_tmpl'}
	      ,{field:'name',minWidth: 200,title: '目标名称',sort: true}
	      ,{field:'status', width:100,  title: '状态',sort: true,templet: '#status_tmpl'}
	      ,{field:'createTimeStr', width:102, title: '创建时间',sort: true}
	      ,{field:'deadlineStr',width:102,  title: '截止日期',sort: true}
	      ,{field:'assignedtoRealName', width:80, title: '指派给'}
	      ,{field:'finishedbyRealName', width:80, title: '完成者'}
	      ,{field:'totalConsumed', width:65, title: '消耗',sort: true}
	      ,{field:'leftHours', width:65, title: '剩余',sort: true}
	      ,{fixed: 'right', width:150, align:'center',title: '操作',toolbar: '#taskListBar'}  
	    ]],
	    done: function(res, curr, count){
	    	//Ajax请求,防止出现横向滚动条 ,见http://fly.layui.com/jie/29408/
	    	$(".layui-table-box").css("width","101%");
	        if(res.totalConsumed > 0){
	        	$("#totalConsumed").text(res.totalConsumed);
	        	$("#totalManDay").text((res.totalConsumed/8).toFixed(2));
	        	$("#totalManMonth").text((res.totalConsumed/192).toFixed(2)); // 除以8再除以24
	        	$("#totalConsumedDiv").show();
	        }
	        if(res.leftHours > 0){
	        	$("#leftHours").text(res.leftHours);
	        	$("#leftDays").text((res.leftHours/8).toFixed(2));
	        	$("#leftMonth").text((res.leftHours/192).toFixed(2));
	        	$("#leftHoursDiv").show();
	        }
	      }
	  });
 	 
 	//异步搜索条件
   var $ = layui.$, active = {
	    reload: function(){
	      var formData = $('#form1').serializeObject();
	      //执行重载
	      table.reload('taskList_table', {
	          where:formData,
	          page:true
	      });
	    }
	  };
 	 
 	//搜索被单击
 	 $('.from1_search').on('click', function(){
	    var type = $(this).data('type');
	    active[type] ? active[type].call(this) : '';
	  });
	});
  
  //为成员设置项目
  function assignTask(taskId){
  		var page = contextPath + "/admin/task/assignTask/" + taskId;
  		//iframe窗
  		layer.open({
  		  type: 2,
  		  id: "assignTask",
  		  title: "指派成员",
  		  area: ['800px'],
  		  content: page, //iframe的url，no代表不显示滚动条
  		  success: function(layero, index) {
  		        layer.iframeAuto(index);
  		        layer.style(index, {
  		        	  top: '60px'
  		        	}); 
  		    }
  		});
  	}
 	 
 	 //开始项目
  function startTask(taskId, status){
  		var page = contextPath + "/admin/task/startTask/" + taskId;
  		layer.open({
	    		  type: 2,
	    		  id: "startTask",
	    		  title: "开始目标",
	    		  area: ['900px'],
	    		  content: page, //iframe的url，no代表不显示滚动条
	    		  success: function(layero, index) {
	    		        layer.iframeAuto(index);
	    		        layer.style(index, {
	    		        	  top: '60px'
	    		        	}); 
	    		    }
	    		});
  	}
 	 
 	 
 	 //完成项目
  function finishTask(taskId, status){
  		var page = contextPath + "/admin/task/finishTask/" + taskId;
  		layer.open({
	    		  type: 2,
	    		  id: "finishTask",
	    		  title: "完成目标",
	    		  area: ['800px'],
	    		  content: page, //iframe的url，no代表不显示滚动条
	    		  success: function(layero, index) {
	    		        layer.iframeAuto(index);
	    		        layer.style(index, {
	    		        	  top: '60px'
	    		        	}); 
	    		    }
	    		});
  	}
 	 
 	 //关闭项目
  function closeTask(taskId, status){
  		var page = contextPath + "/admin/task/closeTask/" + taskId;
  		layer.open({
	    		  type: 2,
	    		  id: "closeTask",
	    		  title: "关闭目标",
	    		  area: ['800px'],
	    		  content: page, //iframe的url，no代表不显示滚动条
	    		  success: function(layero, index) {
	    		        layer.iframeAuto(index);
	    		        layer.style(index, {
	    		        	  top: '60px'
	    		        	}); 
	    		    }
	    		});
  	}
 	 
 	 //取消项目
  function cancelTask(taskId, status){
  		var page = contextPath + "/admin/task/cancelTask/" + taskId;
  		layer.open({
	    		  type: 2,
	    		  id: "cancelTask",
	    		  title: "取消目标",
	    		  area: ['900px'],
	    		  content: page, //iframe的url，no代表不显示滚动条
	    		  success: function(layero, index) {
	    		        layer.iframeAuto(index);
	    		        layer.style(index, {
	    		        	  top: '60px'
	    		        	}); 
	    		    }
	    		});
  	}
 	 
 	 //工时
  function taskEstimate(taskId, status){
  		var page = contextPath + "/admin/task/taskEstimate/" + taskId;
  		layer.open({
	    		  type: 2,
	    		  id: "taskEstimate",
	    		  title: " 目标ID:" + taskId,
	    		  area: ['900px','600px'],
	    		  content: [page] //iframe的url，no代表不显示滚动条
	    		});
  	}
 	 
 //删除
  function deleteById(id) {
      layer.confirm("确定删除吗？", {
 		 icon: 3
 	     ,btn: ['确定','关闭'] //按钮
 	   }, function(){
        	$.ajax({
          		url : "${contextPath}/admin/task/delete/" +id,
          		type : "PUT",
          		dataType :"JSON",
          		async : true,
          		error : function(xhr,status,error){
          			layer.msg("网络错误,请稍后重试!");
          		},
          		success : function(result,status,xhr){
          			if(result == "success"){
          				layer.closeAll('dialog'); //关闭信息框
          				//sendData();
          				 $('.from1_search').click();
          			}else{
          				 layer.msg("删除目标失败，该目标已经有对应的审核过的日志");
          			}
          		}
          	});
	 });
    }
</script>
</body>
</html>